<template>
   <div :class="[sendReceive === 1 ? 'global-message-me':'global-message-user']">
    <span class="global-message" v-html="httpHtml" />
  </div>
</template>

<script>
const hyperlinksreg = /(http:\/\/|https:\/\/)((\w|=|\?|\.|\/|&|-)+)/g // 文本链接识别
export default {
  props: ['info', 'id'],
  computed: {
    httpHtml: function () { // 消息加上超链接
      return this.info.msg.replace(hyperlinksreg, '<a href="$1$2" target="_blank">$1$2</a>')
    },
    sendReceive: function () {
      return this.info.isMe ? 1 : 0
    }
  }
}
</script>

<style lang="scss" scoped>
.box {
    display: inline-flex;
    align-items: center;
    margin: 0 10px 10px 0;
  }
</style>
